<p>major-detail works!</p>
<nz-modal [(nzVisible)]="visible" [nzTitle]="detailItem.id ? '修改专业信息' : '新增专业信息'" [nzMaskClosable]="false"
  (nzOnCancel)="onCancel()" [nzFooter]="nzModalFooter" nzWidth="500">
  <form nz-form #eitorForm="ngForm">
    <nz-form-item class="mb-md">
      <nz-form-control [nzErrorTip]="erroraccout"
        [nzValidateStatus]="name.invalid && (name.dirty || name.touched) ? 'error' : ''" nzHasFeedback>
        <nz-input-group nzPrefixIcon="anticon anticon-user">
          <input #name="ngModel" autocomplete="off" nz-input [(ngModel)]="detailItem.name" name="name"
            [userId]="detailItem.id" placeholder="专业名称" app-async-majorname-validator required />
        </nz-input-group>
        <ng-template #erroraccout let-control>
          <ng-container *ngIf="name.hasError('required')">
            请输入专业名称!
          </ng-container>
          <ng-container *ngIf="name.hasError('nameExists')">
            专业名称已被存在!
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>

    <nz-form-item class="mb-md">
      <nz-form-control [nzErrorTip]="familiesrequired"
        [nzValidateStatus]="families.invalid && (families.dirty || families.touched) ? 'error' : ''" nzHasFeedback>
        <nz-input-group nzPrefixIcon="anticon anticon-user">
          <input #families="ngModel" autocomplete="off" nz-input [(ngModel)]="detailItem.families" name="families"
            placeholder="专业科类" required />
        </nz-input-group>
        <ng-template #familiesrequired let-control>
          <ng-container *ngIf="families.hasError('required')">
            请输入专业科类！
          </ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
  </form>
  <ng-template #nzModalFooter>
    <button nz-button nzType="default" (click)="onCancel()">取消</button>
    <button nz-button nzType="primary" [nzLoading]="loading" (click)="validate(true)"
      [acl]="['SCHOOL_CREATE', 'SCHOOL_UPDATE']">
      确定
    </button>
  </ng-template>
</nz-modal>
